import { Layout, Menu, Button } from "antd";
import { Outlet } from "react-router-dom";
const { Header, Content, Sider } = Layout;
import { getChildrenRoutes } from "@/router";
import { Link } from "react-router-dom";

export default function System() {
  const routes = getChildrenRoutes("system");
  const menus = routes.map((route) => ({
    key: route.path,
    label: <Link to={`/system/${route.path}`}> {route.name} </Link>,
  }));

  return (
    <Layout style={{ minHeight: "100vh" }}>
      <Header></Header>
      <Layout>
        <Sider>
          <Menu theme="dark" mode="inline" items={menus} />
        </Sider>
        <Layout>
          <Outlet />
        </Layout>
      </Layout>
    </Layout>
  );
}
